<template>
  <div>
    <el-dialog
      :visible.sync="interviewcard"
      title="面试信息"
      style="width: auto"
    >
      <el-tabs type="border-card">
        <el-tab-pane label="人员简历">
          <interview-user-interview-card
            :form="form"
            :depname="depname"
            :eduexp="eduexp"
            :workexp="workexp"
            :change="change"
            :selectdepartment="selectdepartment"
            :selectpost="selectpost"
            :type="type"
          ></interview-user-interview-card
        ></el-tab-pane>
        <el-tab-pane label="面试结果">
          <el-container>
            <el-main>
              <interview-user-comment
                :commentdata="commentdata"
              ></interview-user-comment> </el-main></el-container
        ></el-tab-pane>
        <el-tab-pane label="面试操作">
          <el-tabs tab-position="left" style="height: 350px">
            <el-tab-pane label="推送简历">
              <el-form ref="form" label-width="80px" style="margin-top: 15px">
                <el-form-item label="模板选择">
                  <el-switch
                    v-model="ishr"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                  >
                  </el-switch>
                </el-form-item>

                <el-form-item label="薪酬" v-if="ishr">
                  <el-input
                    v-model="form.salary"
                    type="number"
                    style="width: 80%"
                  >
                    <template slot="prepend">￥</template></el-input
                  >
                </el-form-item>

                <el-form-item label="入职日期" v-if="ishr">
                  <el-date-picker
                    suffix-icon="el-icon-date"
                    type="date"
                    placeholder="请选择日期"
                    v-model="form.employdate"
                    format="yyyy 年 MM 月 dd 日"
                    value-format="yyyy-MM-dd"
                    style="width: 80%"
                  ></el-date-picker>
                </el-form-item>

                <el-form-item label="推送人">
                  <remote-select-user ref="rsu"> </remote-select-user>
                </el-form-item>
                <el-form-item>
                  <el-button
                    type="primary"
                    @click="sendinterview(1)"
                    style="width: 40%"
                    v-if="!ishr"
                    >推送简历</el-button
                  >
                </el-form-item>
                <el-form-item>
                  <el-button
                    type="primary"
                    @click="sendinterview(0)"
                    style="width: 40%"
                    v-if="ishr"
                    >推送简历</el-button
                  >
                </el-form-item>
              </el-form></el-tab-pane
            >
            <!-- <el-tab-pane label="人事模板">
              <el-form
                ref="form"
                :model="form"
                label-width="80px"
                style="margin-top: 15px"
              >
                <el-form-item label="薪酬">
                  <el-input
                    v-model="form.salary"
                    type="number"
                    style="width: 80%"
                  >
                    <template slot="prepend">￥</template></el-input
                  >
                </el-form-item>

                <el-form-item label="入职日期">
                  <el-date-picker
                    suffix-icon="el-icon-date"
                    type="date"
                    placeholder="请选择日期"
                    v-model="form.employdate"
                    format="yyyy 年 MM 月 dd 日"
                    value-format="yyyy-MM-dd"
                    style="width: 80%"
                  ></el-date-picker>
                </el-form-item>

                <el-form-item label="推送人">
                <el-select
                    style="width: 80%"
                    v-model="postvalue"
                    filterable
                    remote
                    placeholder="请输入姓名"
                    :remote-method="remoteMethod"
                    :loading="loading"
                  >
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select> -->
            <!-- <remote-select-user ref="rsu1" style="width: 80%">
                  </remote-select-user>
                </el-form-item> -->

            <!-- <el-form-item>
                  <el-button
                    type="primary"
                    @click="sendinterview(0)"
                    style="width: 40%"
                    >推送简历</el-button
                  >
                </el-form-item>
              </el-form></el-tab-pane
            > -->
            <el-tab-pane label="面试通过"
              ><el-form ref="form" label-width="80px" style="margin-top: 15px">
                <el-form-item label="部门">
                  <el-select
                    v-model="depid"
                    placeholder="请选择"
                    style="width: 80%"
                    filterable
                  >
                    <el-option
                      v-for="item in selectdepartment"
                      :key="item.id"
                      :label="item.label"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>

                <el-form-item label="职位">
                  <el-select
                    v-model="post"
                    placeholder="请选择"
                    style="width: 80%"
                    filterable
                  >
                    <el-option
                      v-for="item in selectpost"
                      :key="item.id"
                      :label="item.label"
                      :value="item.label"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>

                <el-form-item label="模板">
                  <el-select
                    v-model="offertype"
                    placeholder="请选择"
                    style="width: 80%"
                  >
                    <el-option
                      label="东杰智能科技集团股份有限公司"
                      value="东杰智能科技集团股份有限公司"
                    ></el-option>
                    <el-option
                      label="太原东杰装备有限公司"
                      value="太原东杰装备有限公司"
                    ></el-option>
                    <el-option
                      label="太原东杰软件开发有限公司"
                      value="太原东杰软件开发有限公司"
                    ></el-option>
                    <el-option
                      label="东杰智能科技集团股份有限公司不锈钢园区分公司"
                      value="东杰智能科技集团股份有限公司不锈钢园区分公司"
                    ></el-option>
                    <el-option
                      label="东上杰智能科技（上海）有限公司"
                      value="东上杰智能科技（上海）有限公司"
                    ></el-option>
                    <el-option
                      label="东杰智能科技（江苏）有限公司"
                      value="东杰智能科技（江苏）有限公司"
                    ></el-option>
                    <el-option
                      label="东杰智能（深圳）有限公司"
                      value="东杰智能（深圳）有限公司"
                    ></el-option>
                    <el-option
                      label="深圳东杰智能研发中心有限公司"
                      value="深圳东杰智能研发中心有限公司"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="offer">
                  <el-upload
                    ref="upload"
                    action="action"
                    :auto-upload="false"
                    :on-change="beforeUpload"
                    :data="filepostdata"
                    :on-remove="onRemove"
                    :file-list="fileList"
                    drag
                    style="width: 80%"
                  >
                    <div class="el-upload__text">
                      将文件拖到此处，或<em>点击选择</em>
                    </div>
                  </el-upload>
                </el-form-item>

                <el-form-item>
                  <el-button
                    type="primary"
                    @click="sendoffer"
                    style="width: 40%"
                    >发送offer</el-button
                  >
                </el-form-item>
              </el-form></el-tab-pane
            >
            <el-tab-pane label="面试失败"
              ><el-form ref="form" label-width="80px" style="margin-top: 15px">
                <el-form-item label="添加标签">
                  <el-select
                    v-model="interviewtag"
                    multiple
                    placeholder="请选择"
                    style="width: 80%"
                  >
                    <el-option
                      v-for="item in taglist"
                      :key="item.value"
                      :label="item.label"
                      :value="item.label"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item>
                  <el-button
                    type="primary"
                    @click="sendinterviewfail"
                    style="width: 40%"
                    >转入储备人才库</el-button
                  >
                </el-form-item>
              </el-form></el-tab-pane
            >
          </el-tabs>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>

    <el-dialog>
      <work-user-info-card></work-user-info-card>
    </el-dialog>
  </div>
</template>

<script>
const formData = new FormData();
import InterviewUserInterviewCard from "./InterviewUserInterviewCard.vue";
import InterviewUserComment from "./InterviewUserComment.vue";
import WorkUserInfoCard from "../WorkUser/WorkUserInfoCard.vue";
import RemoteSelectUser from "../common/RemoteSelectUser.vue";

export default {
  components: {
    InterviewUserInterviewCard,
    InterviewUserComment,
    WorkUserInfoCard,
    RemoteSelectUser,
  },

  created() {
    this.$bus.$on("getInterview", (row) => {
      this.interviewcard = true;
      this.getUserDetail(row);
      this.interviewid = row.id;
      this.getComment(row.id);
      this.getusertag(4);
    });

    this.$bus.$on("sendEmpoly", (row) => {
      this.empolycard = true;
      this.getUserDetail(row);
      this.interviewid = row.id;
      this.getComment(row.id);
    });

    this.getDepartment();
    this.getpost();
  },

  data() {
    return {
      type: 2,

      ishr: false,

      selectdepartment: [],
      selectpost: [],

      delete_index: "",
      filepostdata: {},
      fileList: [],
      taglist: [],

      interviewtag: [],

      offertype: "",
      depid: "",
      post: "",

      form: {},
      eduexp: [],
      workexp: [],
      change:[],
      depname: "",

      // postvalue: [], //推送人
      interviewid: "", //面试人

      commentdata: [],

      interviewcard: false,
      empolycard: false,

      // // 远程搜索
      // options: [],
      // value: [],
      // list: [],
      // loading: false,
      // states: [],
    };
  },

  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },

  methods: {
    sendinterviewfail() {
      this.$confirm("确定转入储备人才库?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let data = {
            id: this.form.id,
            tag: this.interviewtag,
          };
          this.$axios
            .post("api/interview/sendinterviewfail", data)
            .then((response) => {
              this.$notify({
              title: "面试失败",
              message: response.data,
              type: "success",
              duration: 1500,
            });
            })
            .catch(function (error) {
              console.log(error);
            });
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    async getDepartment() {
      this.$axios
        .get(`api/member/getdepartment`)
        .then((response) => {
          this.selectdepartment = response.data;
        })
        .catch(function (error) {
          console.log(error);
        });
    },

    async getpost() {
      this.$axios
        .post("api/member/getpost")
        .then((response) => {
          this.selectpost = response.data;
        })

        .catch(function (error) {
          console.log(error);
        });
    },
    beforeUpload(file) {
      formData.append("files", file.raw);
    },

    onRemove(file) {
      for (let i = 0, len = this.fileinfo.length; i < len; i++) {
        if (this.fileinfo[i].file_id == file.response.file_id) {
          this.delete_index = i;
        }
      }

      this.fileinfo.splice(this.delete_index, 1);
    },

    async sendoffer() {
      this.$confirm("确定发送offer?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        const loading = this.$loading({
          lock: true,
          text: "正在发送offer，请稍等",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        });

        this.loading = true;
        formData.append("email", this.form.email);
        formData.append("id", this.form.id);
        formData.append("offertype", this.offertype);
        formData.append("depid", this.depid);
        formData.append("post", this.post);
        this.$axios
          .post("api/interview/sendoffer", formData)
          .then((response) => {
            this.loading = false;
            loading.close();
            this.$notify({
              title: "发送offer",
              message: response.data,
              type: "success",
              duration: 1500,
            });
          })
          .catch(function (error) {
            console.log(error);
          });
      });
    },

    async getComment() {
      let id = this.interviewid;
      let comment = await this.$axios.get(
        `api/interview/getinterviewcomment?id=` + id
      );
      this.commentdata = comment.data;
    },

    async getusertag(type) {
      let id = type;
      let tag = await this.$axios.get(`api/member/getusertag?type=` + id);
      this.taglist = tag.data;
    },

    async sendinterview(type) {
      if (type == 0) {
        let data1 = {
          type: type,
          salary: this.form.salary,
          employdate: this.form.employdate,
          type: type,
          list: this.$refs.rsu.postvalue,
          id: this.interviewid,
          posterid: sessionStorage.getItem("id"),
        };
        this.$axios
          .post("api/interview/setinfo", data1)
          .then((response) => {})
          .catch(function (error) {
            console.log(error);
          });
      }

      let datas = {
        type: type,
        list: this.$refs.rsu.postvalue,
        id: this.interviewid,
        posterid: sessionStorage.getItem("id"),
      };
      console.log(this.$refs.rsu);
      this.$axios
        .post("api/interview/sendinterview", datas)
        .then((response) => {
          this.postvalue = [];
          this.$notify({
            title: "成功",
            message: response.data,
            type: "success",
          });
        })
        .catch(function (error) {
          console.log(error);
        });
    },

    async getUserDetail(row) {
      let id = row.id;
      try {
        let res = await this.$axios.get(`api/member/getuserdetail?id=` + id);
        this.form = res.data.member[0];
        this.eduexp = res.data.eduexp;
        this.workexp = res.data.workexp;
        this.change=res.data.change;
        let dep = await this.$axios.get(
          `api/member/getdepname?id=` + res.data.member[0].depid
        );
        this.depname = dep.data;
      } catch (e) {}
    },
  },
};
</script>

<style lang="scss" scoped>
</style>